<template>
  <u-modal v-model="show" title="关注公众号" :show-confirm-button="false">
    <template slot="default">
      <view class="slot-content">
        <view class="tips_msg tc">{{text}}</view>
        <view class="u-flex justify-between" style="background: #F7F8FA;border-radius: 8px;padding: 24rpx;" @click="_attendClick">
          <view class="items-center">
            <image src="https://qqposs.oss-cn-shenzhen.aliyuncs.com/mpAppImg/icon/logo2_icon.png" mode="aspectFill" style="width:80rpx;height:80rpx;border-radius: 50%;" />
            <view class="u-p-l-20 fz-14 fw5">速速团</view>
          </view>
          <view style="color: #323233;">
            <i class="iconfont icon-arrow_right" />
          </view>
        </view>
        <u-icon name="close" size="24" class="closeIcon" @click="_closeClick" />
        <view class="couBtn fz-14 u-m-t-32" @click="_attendClick">去关注</view>
      </view>
    </template>
  </u-modal>
</template>

<script>
export default {
  name: 'attendOfficial',
  props: {
    show: {
      type: Boolean,
      default: false
    },
    text: {
      type: String,
      default: '关注公众号，第一时间接收到通知'
    },
    // 是否刷新页面数据
    isRefresh: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    _attendClick() {
      if (this.isRefresh) this.setIsRefreshType(true)
      this._closeClick()
      this.navigateTo({url: '/pagesA/components/WebView'})
    },
    _closeClick() {
      this.$emit('close', false)
    }
  }
}
</script>

<style lang="scss" scoped>
.slot-content{
  position: relative;
  .couBtn{
    width: 524rpx;
    height: 80rpx;
    line-height: 80rpx;
    text-align: center;
    color: #fff;
    background: #E44435;
    border-radius: 40rpx;
  }
  .closeIcon{
    position: absolute;
    padding: 20rpx;
    top: -90rpx;
    right: 0;
    color: $n6Color;
  }
}
</style>